// 登录注册页面显示与隐藏
(function () {
    let login_btn = document.querySelector(".login_btn")
    let login_box = document.querySelector(".login_box")
    login_btn.onclick = function (e) {
        if (e.target.classList.contains('login_btn')) {
            login_box.style.display = 'flex';
        }
        if (e.target.classList.contains('login_box')) {
            login_box.style.display = 'flex';
        }
    }
    login_box.onclick = function (e) {
        if (e.target.classList.contains('login_btn')) {
            login_box.style.display = 'none';
        }
        if (e.target.classList.contains('login_box')) {
            login_box.style.display = 'none';
        }
    }
})();
// 登录注册页面切换
(function () {
    let login_info = document.querySelector('.login_info')
    let regist_info = document.querySelector('.regist_info')
    let tologin = document.querySelector('.tologin')
    let toregist = document.querySelector('.toregist')
    toregist.addEventListener('click', function () {
        regist_info.style.display = 'flex';
        login_info.style.display = 'none';

    })
    tologin.addEventListener('click', function () {
        // console.log(111);
        regist_info.style.display = 'none';
        login_info.style.display = 'flex';

    })
})();
// 注册事件
(function () {
    let regist_tel = document.querySelector('input[name="tel"]')
    let login_code = document.querySelector('input[name="code"]')
    let regist_paswd = document.querySelector('input[name="pas"]')
    let regist_paswd1 = document.querySelector('input[name="pas1"]')
    let regist_btn = document.querySelector('.regist_btn')
    let code_btn = document.querySelector('.code_btn')

    let strs = 0 // 发送验证码  strs 验证码定时器   sec秒数变量
    code_btn.onclick = function () {
        let tel = regist_tel.value


        // 判断账号
        var reg = /^[1][3,4,5,7,8][0-9]{9}$/;
        if (!reg.test(tel)) {
            alert('请输入正确的手机号')
            return false
        }
        // 账号正确发送验证码
        else {

            if (strs) {
                return false
            }
            else {
                // 发起请求
                axios.get(`/sendcode?tel=${tel}`)
                    .then(function (response) {
                        // 处理成功情况
                        console.log(response);
                    })
                    .catch(function (error) {
                        // 处理错误情况
                        console.log(error);
                    })
                    .then(function () {
                        // 总是会执行
                    });

                let sec = 60
                strs = setInterval(() => {
                    sec--;
                    if (sec == 0) {
                        code_btn.innerHTML = "重新发送"
                        clearInterval(strs)
                        strs = 0
                        return false
                    }
                    code_btn.innerHTML = sec
                }, 1000);

            }

        }
    }
    regist_btn.addEventListener('click', function () {
        let login_info = document.querySelector('.login_info')
        let regist_info = document.querySelector('.regist_info')
        let tel = regist_tel.value
        let code = login_code.value
        let passwd = regist_paswd.value
        let passwd1 = regist_paswd1.value
        // 判断密码是否一致
        var reg1 = /^(?=.*[a-zA-Z])(?=.*\d).{1,9}$/
        if (!reg1.test(passwd)) {
            alert("密码由1-9位数字和字母组成（必须包含）")
            return false
        }
        if (passwd != passwd1) {
            alert('两次输入密码不一致')
            return false
        }
        else {
            axios.post('/regist', {
                tel: tel,
                code: code,
                passwd: passwd
            })
                .then(function (response) {
                    if (response.data.code == -1) {
                        alert('验证码错误')
                    }
                    else if (response.data.code == 0) {
                        alert('该用户已注册')
                    }
                    else {
                        regist_info.style.display = 'none';
                        login_info.style.display = 'flex';
                        alert('注册成功')

                    }
                })
                .catch(function (error) {
                    console.log(error);
                });
        }
    });

})();
// 登录事件
(function () {
    let login_btnmin = document.querySelector('.login_btnmin')
    let login_tel = document.querySelector('input[name="login_tel"]')
    let login_passwd = document.querySelector('input[name="login_passwd"]')
    let menu_box2 = document.querySelector('.menu_box2')
    let login_btn = document.querySelector('.login_btn')
    let login_box = document.querySelector('.login_box')
    // 个人中心跳转   
    menu_box2.onclick = function () {
        console.log(111);
        window.location.href = './userinfo.html'
    }


    login_btnmin.addEventListener('click', function () {
        let tel = login_tel.value
        let passwd = login_passwd.value
        // 判断账号
        var reg = /^[1][3,4,5,7,8][0-9]{9}$/;
        if (!reg.test(tel)) {
            alert('请输入正确的手机号')
            return false
        }
        axios.post('/login', {
            tel: tel,
            passwd: passwd
        })
            .then(function (response) {
                console.log(response);
                response.data.code
                if (response.data.code == 0) {
                    alert('密码错误')
                }
                else if (response.data.code == -1) {
                    alert('账号不存在')
                }
                else {
                    setcookie("tel", tel, 1)
                    console.log(getcookie("tel"));
                    menu_box2.style.display = 'block'
                    login_btn.style.display = 'none'
                    login_box.style.display = 'none'
                    window.location.href = "./index.html"

                    alert('登录成功')

                }

            })
    })
})();
// 判断用户是否登录
(function () {
    let menu_box2 = document.querySelector('.menu_box2')
    let login_btn = document.querySelector('.login_btn')
    let search_input = document.querySelector(".search_input")
    if (getcookie("tel")) {
        menu_box2.style.display = 'flex'
        login_btn.style.display = 'none'
        search_input.placeholder = '立即搜索'
    }
    else {
        menu_box2.style.display = 'none'
        login_btn.style.display = 'flex'
    }
})();
// 页面加载文章页面切换分类
(function () {
    // 切换分类
    let classify_li = document.querySelector(".classify_li")
    let article_content = document.querySelector(".article_content")
    axios.get('/getarticle')
        .then(function (response) {
            // 处理成功情况
            let menu_box_headimg = document.querySelector(".menu_box_headimg")
            if (getcookie("tel")) {
                console.log(response.data.post);
                menu_box_headimg.src = response.data.post

            }
            let allarticle = response.data.results

            classify_li.onclick = function () {
                let classify = event.target.innerHTML
                console.log(classify);
                if (classify == "推荐") {
                    allarticle = response.data.results
                    console.log(response.data.results);
                    console.log(classify);
                }
                else if (classify == "穿搭") {
                    allarticle = response.data.result[0]

                }
                else if (classify == "美食") {
                    allarticle = response.data.result[1]

                }
                else if (classify == "彩妆") {
                    allarticle = response.data.result[2]

                }
                else if (classify == "影视") {
                    allarticle = response.data.result[3]

                }
                else if (classify == "职场") {
                    allarticle = response.data.result[4]

                }
                else if (classify == "家居") {
                    allarticle = response.data.result[5]

                }
                else if (classify == "游戏") {
                    allarticle = response.data.result[6]

                }
                else if (classify == "旅行") {
                    allarticle = response.data.result[7]

                }
                else if (classify == "健身") {
                    allarticle = response.data.result[8]

                }
                console.log(allarticle);
                let str = ''
                allarticle.forEach(item => {
                    str += `
                 <div data-myid=${item.aid} class="article_box myid ${item.aid}">
                            <div  data-myid=${item.aid} class='myid'><span class="title_txt">${item.atitle}</span></div>
                            <div  data-myid=${item.aid} class='myid'><span style=" color: #999;">作者： ${item.auname}</span></div>
                            <div  data-myid=${item.aid} class='myid'><span style=" color: #999;">${item.alabel}</span></div>
            </div> <hr> `

                });
                article_content.innerHTML = str


            }
            let str = ''
            allarticle.forEach(item => {
                str += `
                 <div data-myid=${item.aid} class="article_box myid ${item.aid}">
                            <div  data-myid=${item.aid} class='myid'><span class="title_txt">${item.atitle}</span></div>
                            <div  data-myid=${item.aid} class='myid'><span style=" color: #999;">作者： ${item.auname}</span></div>

                            <div  data-myid=${item.aid} class='myid'><span style=" color: #999;">${item.alabel}</span></div>
            </div> <hr> `

            });
            article_content.innerHTML += str

        })
        .catch(function (error) {
            // 处理错误情况
            console.log(error);
        })
        .then(function () {
            // 总是会执行
        });
})();
// 文章详情页的跳转
(function () {
    let article_content = document.querySelector(".article_content")
    article_content.onclick = function () {
        if (event.target.classList.contains('myid')) {
            let aid = event.target.getAttribute('data-myid');
            window.location.href = `./articleinfo.html?aid=${aid}`
        }
    }

})();
// 搜索事件
(function () {
    let search_img = document.querySelector(".search_img")
    let input = document.querySelector(".search_input")
    let article_content = document.querySelector(".article_content")
    search_img.onclick = function () {
        axios.get(`/search?txt=${input.value}`)
            .then(function (response) {
                // 处理成功情况
                let allarticle = response.data.res
                console.log(allarticle);
                let str = ''
                allarticle.forEach(item => {
                    str += `
                 <div data-myid=${item.aid} class="article_box myid ${item.aid}">
                            <div  data-myid=${item.aid} class='myid'><span class="title_txt">${item.atitle}</span></div>
                            <div  data-myid=${item.aid} class='myid'><span style=" color: #999;">作者： ${item.auname}</span></div>

                            <div  data-myid=${item.aid} class='myid'><span style=" color: #999;">${item.alabel}</span></div>
            </div> <hr> `

                });
                if (allarticle.length == 0) {

                    article_content.innerHTML = `<span>未找到相关搜索结果</span>`
                }
                else {
                    article_content.innerHTML = str

                }

                console.log(response);
            })
            .catch(function (error) {
                // 处理错误情况
                console.log(error);
            })
            .then(function () {
                // 总是会执行
            });
    }
})()



